<!-- 合并详情 -->
<template>
  <el-dialog
    custom-class="availableStockDialog"
    append-to-body
    :close-on-click-modal="false"
    title="合并详情"
    :visible.sync="availableStockDialog.visible"
    v-if="availableStockDialog.visible"
    width="80%"
    top="7vh"
    @close="close()"
  >
    <avue-form v-model="availableStockHeaderForm" :option="availableStockHeaderOption"></avue-form>
    <div class="gap"></div>
    <avue-crud
      :option="availableStockDialog.option"
      :table-loading="availableStockDialog.loading"
      :data="availableStockDialog.data"
      :page.sync="availableStockDialog.page"
      v-model="availableStockDialog.form"
      ref="availableStockTableCrud"
    >
    </avue-crud>
  </el-dialog>
</template>

<script>
import { getMaterialMergeDetail } from '@/api/warehouse/preMaterialList';
export default {
  name: 'availableStockDialog',
  props: {
    visible: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      availableStockHeaderForm: {
        partNo: '',
        partName: '',
        partModel: ''
      },
      availableStockHeaderOption: {
        submitBtn: false,
        emptyBtn: false,
        detail: true,
        column: [
          {
            label: '物料编码',
            span: 12,
            prop: 'partNo'
          },
          {
            label: '物料名称',
            span: 12,
            prop: 'partName'
          },
          {
            label: '物料型号',
            span: 12,
            prop: 'partModel'
          },
          {
            label: '发料仓',
            span: 12,
            prop: 'issuedWarehouseCode'
          },
          {
            label: '应发数量',
            span: 12,
            prop: 'recommendQuantity'
          },
          {
            label: '实发数量',
            span: 12,
            prop: 'issuedQuantity'
          },
          {
            label: '待发数量',
            span: 12,
            prop: 'remainingQuantity'
          },
          {
            label: '物料状态',
            span: 12,
            prop: 'status',
            type: 'select',
            dicData: [
              { label: '待出库', value: 1 },
              { label: '部分出库', value: 2 },
              { label: '已完成', value: 3 },
              { label: '已拆分', value: 4 }
            ]
          }
        ]
      },
      availableStockDialog: {
        visible: false,
        loading: false,
        page: {
          pageSize: 15,
          currentPage: 1,
          total: 0
        },
        data: [],
        form: {},
        option: {
          tip: false,
          searchShow: true,
          searchSpan: 4,
          searchMenuSpan: 6,
          dialogClickModal: false,
          height: '400',
          border: true,
          addBtn: false,
          editBtn: false,
          delBtn: false,
          viewBtn: false,
          cancelBtn: false,
          saveBtn: false,
          selection: false,
          menu: false,
          page: true,
          index: true,
          indexLabel: '序号',
          refreshBtn: false,
          expandBtn: false,
          columnBtn: false,
          menuWidth: 150,
          column: [
            {
              label: '工单号',
              prop: 'associatedOrderNo'
            },
            {
              label: '单据数量',
              prop: 'associatedRequiredQuantity'
            },
            {
              label: '发料仓',
              prop: 'issuedWarehouseCode'
            },
            {
              label: '应发数量',
              prop: 'associatedRecommendQuantity'
            },
            {
              label: '已发数量',
              prop: 'associatedIssuedQuantity'
            },
            {
              label: '待发数量',
              prop: 'associatedRemainingQuantity'
            },
            {
              label: '超发数量',
              prop: 'overQuantity'
            },
            {
              label: '状态',
              prop: 'status',
              type: 'select',
              dicData: [
                { label: '待出库', value: 1 },
                { label: '部分出库', value: 2 },
                { label: '已完成', value: 3 },
                { label: '已拆分', value: 4 }
              ]
            }
          ]
        }
      }
    };
  },
  watch: {
    visible: {
      handler(value) {
        this.availableStockDialog.visible = value;
      }
    }
  },
  methods: {
    getData(row) {
      this.availableStockDialog.loading = true;
      getMaterialMergeDetail(row.preparationOrderNo, row.preparationOrderLot)
        .then((res) => {
          const data = res.data.data;
          this.availableStockDialog.data = data;
          this.$forceUpdate();
        })
        .finally(() => {
          this.availableStockDialog.loading = false;
        });
    },

    close() {
      this.availableStockDialog.visible = false;
      this.$emit('closeDialog');
    }
  }
};
</script>

<style lang="scss" scoped>
::v-deep .availableStockDialog {
  .avue-crud__menu {
    display: none;
  }
  .ruleRowForm {
    margin-bottom: 5px;
    .el-radio {
      margin-right: 10px;
    }
    .header-icon {
      margin-right: 10px;
    }
  }
  .gap {
    margin: 15px 0;
  }
}
</style>
